<template>
    <el-row>
      <el-col :span="24">
        <el-form ref="dataForm" :rules="rules" :model="dataForm" status-icon label-position="left" label-width="100px"
                 style="width: 400px; margin-left:50px;">
          <el-form-item label="规则名称" prop="ruleName">
            <el-select v-model="dataForm.ruleAction" placeholder="请选择事件" @change="ruleChange">
              <el-option
                v-for="(item,index) in listData"
                :key="index"
                :label="item.ruleName"
                :value="item.ruleAction">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="规则Action">
            <el-input v-model="dataForm.ruleAction" :disabled="true" />
          </el-form-item>
          <el-form-item label="周期">
            <el-radio-group v-model="dataForm.cycle" style="width: 500px;">
              <el-radio-button label="一次"></el-radio-button>
              <el-radio-button label="分钟"></el-radio-button>
              <el-radio-button label="小时"></el-radio-button>
              <el-radio-button label="每天"></el-radio-button>
              <el-radio-button label="每周"></el-radio-button>
              <el-radio-button label="每月"></el-radio-button>
              <el-radio-button label="不限"></el-radio-button>
            </el-radio-group>
          </el-form-item>
          <el-form-item label="间隔时间">
            <el-input v-model="dataForm.intervals" />
          </el-form-item>
          <el-form-item label="是否去重">
            <el-radio-group v-model="dataForm.deduplication">
              <el-radio :label="0">否</el-radio>
              <el-radio :label="1">是</el-radio>
            </el-radio-group>
          </el-form-item>
          <el-form-item label="限制次数">
            <el-input-number v-model="dataForm.limitCount" />
          </el-form-item>

          <el-form-item label="积分">
            <el-input-number v-model="dataForm.integral" />
          </el-form-item>
          <el-form-item label="成长值">
            <el-input-number v-model="dataForm.experience" />
          </el-form-item>
          <div>
            <el-button @click="cancel">取消</el-button>
            <el-button v-if="!dataForm.id" type="primary" @click="createData">确定</el-button>
            <el-button v-else type="primary" @click="updateData">确定</el-button>
          </div>
        </el-form>
      </el-col>
    </el-row>
</template>

<script>
import { create, update, ruleList } from '@/api/apiRule'
export default {
  name: 'add',
  props: ['dataForm','cancel'],
  data(){
    return {
      rules: rules,
      listData: undefined
    }
  },
  mounted() {
    this.$nextTick(() => {
      this.$refs['dataForm'].clearValidate()
    })
    this.initData()
  },
  methods: {
    ruleChange(val){
      let list = this.listData.filter(item => item.ruleAction === val)
      console.log(list)
      this.dataForm.ruleName = list[0].ruleName
    },
    initData(){
      ruleList().then(res => {
        this.listData = res.data.data
      })
    },
    createData() {
      this.$refs['dataForm'].validate(valid => {
        if (valid) {
          create(this.dataForm).then(response => {
            this.$notify.success({
              title: '成功',
              message: '创建成功'
            })
            this.cancel()
          })
        }
      })
    },
    updateData() {
      this.$refs['dataForm'].validate(valid => {
        if (valid) {
          update(this.dataForm).then(() => {
            this.$notify.success({
              title: '成功',
              message: '更新人文成功'
            })
            this.cancel()
          })
        }
      })
    }
  }
}


const rules = {
  name: [
    { required: true, message: '店铺名称不能为空', trigger: 'blur' }
  ],
  storeType: [
    { required: true, message: '店铺类型不能为空', trigger: 'blur' }
  ],
  contacts: [
    { required: true, message: '联系人不能为空', trigger: 'blur' }
  ],
  phoneCode: [
    { required: true, message: '手机号不能为空', trigger: 'blur' },
    {
      pattern: /^0{0,1}(13[0-9]|15[7-9]|153|156|18[7-9])[0-9]{8}$/,
      message: '手机号格式不对',
      trigger: 'blur'
    }
    ]
}



</script>

<style scoped>

</style>
